import 'package:flutter/material.dart';
import 'package:flutter_app/components/layout.dart';
import 'package:flutter_app/components/Expansion.dart';
import 'package:flutter_app/utils/AppUtil.dart';
class FixedDetailPage extends StatefulWidget {
  @override
  _FixedDetailPageState createState() => _FixedDetailPageState();
}
Widget answerText(String text){
  return Text(text,style: TextStyle(color: Colors.black54,fontSize: 15),);
}

class _FixedDetailPageState extends State<FixedDetailPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        brightness: Brightness.dark,
        backgroundColor: Colors.blueAccent[400],
        elevation: 0,
        title: HeadTitle('BCT新客专享 M75'),
        centerTitle: true,
      ),
      body: Column(
        children: [
          Expanded(
              child: RefreshIndicator(
            onRefresh: () async {},
            child: SingleChildScrollView(
              child: Column(
                children: [
                  Container(
                    height: 175,
                    color: Colors.white,
                    child: Stack(
                      children: [
                        Positioned(
                          top: 0,
                          left: 0,
                          right: 0,
                          child: Container(
                            color: Colors.blueAccent[400],
                            height: 130,
                          ),
                        ),
                        Positioned(
                          top: 10,
                          left: 0,
                          right: 0,
                          child: Container(
                            padding: EdgeInsets.symmetric(
                                horizontal: 20.0, vertical: 15.0),
                            margin: EdgeInsets.symmetric(horizontal: 15.0),
                            decoration: BoxDecoration(
                                color: Colors.white,
                                borderRadius: BorderRadius.circular(4),
                                boxShadow: [
                                  BoxShadow(
                                      blurRadius: 2.0,
                                      spreadRadius: 2.0,
                                      color: Colors.black.withOpacity(0.1),
                                      offset: Offset(1.0, 1.0))
                                ]),
                            child: Column(
                              children: [
                                Row(
                                  children: [
                                    ColumnStart(
                                      children: [
                                        Text(
                                          '15.00%',
                                          style: TextStyle(
                                              fontSize: 28,
                                              fontWeight: FontWeight.bold,
                                              color: Colors.blueAccent),
                                        ),
                                        Text(
                                          '年化收益率',
                                          style: TextStyle(color: Colors.grey),
                                        ),
                                      ],
                                    ),
                                    SizedBox(
                                      width: 20,
                                    ),
                                    ColumnStart(
                                      children: [
                                        Text(
                                          '14天',
                                          style: TextStyle(
                                              fontSize: 24,
                                              fontWeight: FontWeight.bold),
                                        ),
                                        Text(
                                          '期限',
                                          style: TextStyle(color: Colors.grey),
                                        ),
                                      ],
                                    )
                                  ],
                                ),
                                Container(
                                    margin: EdgeInsets.symmetric(vertical: 10),
                                    child: Divider(
                                      color: Colors.grey.withOpacity(0.7),
                                    )),
                                Row(
                                  children: [
                                    TagContainer('100 USDT 起投'),
                                    SizedBox(
                                      width: 15,
                                    ),
                                    TagContainer('持有至到期'),
                                  ],
                                )
                              ],
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                  Container(
                    color: Colors.white,
                    padding: EdgeInsets.symmetric(horizontal: 15.0),
                    child: ColumnStart(
                      children: [
                        Row(
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: [
                            Icon(Icons.info_outline,
                                size: 14, color: Colors.grey),
                            Text(
                              ' 存入'+AppUtil.formatNum(10000)+' USDT,到期可得'+AppUtil.formatNum(10057.53,point:2)+' USDT。',
                              style:
                                  TextStyle(fontSize: 13, color: Colors.grey),
                            )
                          ],
                        ),
                        SizedBox(
                          height: 20,
                        ),
                        ColumnStart(
                          children: [
                            Text(
                              '购买步骤',
                              style:
                                  TextStyle(fontSize: 16, color: Colors.black),
                            ),
                            SizedBox(
                              height: 20,
                            ),
                            Row(
                              children: [
                                Image.asset(
                                  "assets/images/ic_punter_step_quantity.png",
                                  width: 35,
                                ),
                                SizedBox(
                                  width: 15,
                                ),
                                ColumnStart(
                                  children: [
                                    Text('2021-02-25'),
                                    Text('存入本金'),
                                  ],
                                ),
                              ],
                            ),
                            SizedBox(
                              height: 20,
                            ),
                            Row(
                              children: [
                                Image.asset(
                                  "assets/images/ic_punter_step_pay.png",
                                  width: 35,
                                ),
                                SizedBox(
                                  width: 15,
                                ),
                                ColumnStart(
                                  children: [
                                    Text('2021-02-26 00:00'),
                                    Text('开始计息'),
                                  ],
                                ),
                              ],
                            ),
                            SizedBox(
                              height: 20,
                            ),
                            Row(
                              children: [
                                Image.asset(
                                  "assets/images/ic_usd_product_step_settled.png",
                                  width: 35,
                                ),
                                SizedBox(
                                  width: 15,
                                ),
                                ColumnStart(
                                  children: [
                                    Text('2021-03-12  00:00'),
                                    Text(
                                      '到期回款',
                                      style: TextStyle(color: Colors.black),
                                    ),
                                  ],
                                ),
                              ],
                            ),
                          ],
                        ),
                        SizedBox(
                          height: 20,
                        ),
                        Expansion(
                          title: '基本规则 ',
                          child: ColumnStart(
                            children: [
                              answerText('- 每单购买金额至少 100 USDC'),
                              answerText('- 每单购买金额不超过'+AppUtil.formatNum(2000)+' USDC'),
                              answerText('- 限购一笔'),
                            ]
                          ),
                        ),
                        SizedBox(
                          height: 5,
                        ),
                        Text('常见问题',style:
                        TextStyle(fontSize: 16, color: Colors.black),),
                        Expansion(
                            title:'"年化收益"是固定的还是浮动的？',
                          child: answerText('固定收益,不可提前赎回'),
                        ),
                        Expansion(
                            title:'如何保障我的资金安全？',
                          child: Container(
                            width:MediaQuery.of(context).size.width-30,
                            child: answerText(
                                '您的资金将用于Matrixport平台客户的质押借贷、囤币、套保、配资等借贷业务需求，matrixport通过实时的质押率监控、完善的风控系统、高效的清算流程，保障客户的本金安全。'
                            ),
                          ),
                        ),
                        Expansion(
                          title: '具体有哪些风险？',
                          child: Container(
                            width:MediaQuery.of(context).size.width-30,
                            child: answerText(
                                'Matrixport不承诺100%刚性兑付，若市场行情发生变化，平仓/清算过程未足额收回代偿本金，投资人需承担由此带来的收益或本金损失。'
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                ],
              ),
            ),
          )),
          //底部的
          Container(
            color: Colors.white,
            padding: EdgeInsets.symmetric(horizontal: 15.0, vertical: 15.0),
            child: Column(
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Text('剩余可购：'),
                    Text(
                      AppUtil.formatNum(114117.68,point:2)+' USDT',
                      style: TextStyle(color: Colors.blueAccent),
                    ),
                  ],
                ),
                SizedBox(
                  height: 10,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Expanded(
                      child: Container(
                        color: Colors.blueAccent,
                        child: FlatButton(
                            onPressed: () {Navigator.pushNamed(context, '/fixed/buy');},
                            textColor: Colors.white,
                            child: Text('购买')),
                      ),
                    ),
                  ],
                )
              ],
            ),
          )
        ],
      ),
    );
  }
}
